<!--
 * @Description: 
 * @Author: Wen
 * @Date: 2024-11-05 10:28:19
 * @LastEditors: Wen
 * @LastEditTime: 2024-11-05 15:31:35
 * 太棒了，又坚持了一天
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>背景图片</title>
    <style>
        body{
            /* 清除默认布局 */
            margin: 0;
        }
        #app{
            width: calc(100vm - 10px);
            height: calc(100vh - 20px);
            border: 7px solid rgb(10, 10, 10);
            background-image:url("img/lh.png");
            /* 默认 水平垂直重复 */
            /* background-repeat: repeat-x;
            background-repeat: repeat-y; */
            background-repeat: no-repeat;
            /* 设置背景图片的位置 */
            background-position: center;
            /* background-position: 50% 50%;
            background-position: 50px 50px; */
            /* 设置背景图片大小 */
            /* background-size: 90% 87%; */
            background-size: contain ;
            /* background-size: url(); */

        }
    </style>
</head>
<body>
    <div id="app"></div>
</body>
</html>